<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>导入数据</title>
    <link rel="stylesheet" type="text/css" href="./css/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="./css/themes/icon.css">
    <link rel="stylesheet" type="text/css" href="./css/demo.css">
    <script type="text/javascript" src="./js/jquery.min.js"></script>
    <script type="text/javascript" src="./js/jquery.easyui.min.js"></script>
    <style>
        .alertMessageBg{
            position:fixed;
            _position:absolute;
            width:100%;
            height:100%;
            left:0;
            top:0;
            background:#000;
            opacity:0.5;
            -moz-opacity:0.5;
            filter:alpha(opacity=50);
            z-index:97;
            display:none;
        }
        .alertMessageDivBorder{
            position:fixed;
            _position:absolute;
            width:750px;
            height:370px;
            left:50%;
            top:50%;
            margin:-185px 0 0 -375px;
            background:#000;
            filter:alpha(opacity=30);
            -moz-opacity:0.3;
            opacity:0.3;
            z-index:98;
            display:none;
        }
        .alertMessageDiv{
            position:fixed;
            _position:absolute;
            width:730px;
            height:350px;
            left:50%;
            top:50%;
            margin:-175px 0 0 -365px;
            background:#fff;
            z-index:99;
            display:none;
            font-size:14px;
        }
    </style>
</head>
<body style="text-align:center;">
    <div class="alertMessageBg" id="p1"></div>
    <!--<div class="alertMessageDivBorder" id="p2"></div>-->
    <div id="p" class="alertMessageDiv easyui-progressbar div-c" style="width:400px; display:none;"></div>
    <!--
    <div class="alertMessageBg"></div>
    <div class="alertMessageDivBorder"></div>
    <div class="alertMessageDiv"></div>
    -->
    <script>
        function start(){
            $('#p').show();
            $('#p1').show();
            /*$('#p2').show();*/

            var value = $('#p').progressbar('getValue');
            if (value < 100){
                value += Math.floor(Math.random() * 10);
                $('#p').progressbar('setValue', value);
                setTimeout(arguments.callee, 200);
            }
        };
    </script>
    <div class="easyui-panel" title="导入订单信息" style="width:400px;padding:30px 70px 50px 70px">
        <form id= "uploadForm" action= "/readOrder" method= "post" enctype ="multipart/form-data">
            <div style="margin-bottom:20px">
                <div>导入的订单不能重复:</div>
                <input class="easyui-filebox" name="orderExcel" id="goodsFile" data-options="prompt:'请选择文件...'" style="width:100%">
            </div>
            <div>
                <input type="submit" value="确认上传" onclick="start()"/>
            </div>
        </form>
    </div>
</body>
<script language="JavaScript">
    $("#uploadFile").click(function(){
    });
</script>
</html>